<!-- sign_up -->
<template>
    <div class="container a-container" id="a-container">
        <form  v-on:submit.prevent class="form" id="a-form" method="" action="">
          <h2 class="form_title title">Create Account</h2>
          <div class="form__icons">
             <img class="form__icon" src=" ">
             <img class="form__icon" src=" ">
             <img class="form__icon" src=" ">
          </div>
          <span class="form__span">or use email for registration</span>
          <input class="form__input" type="text" placeholder="Name">
          <input class="form__input" type="text" placeholder="Email">
          <input class="form__input" type="password" placeholder="Password">
          <button class="switch__button button switch-btn">SIGN UP</button>
        </form>
    </div>
</template>

<script setup lang="ts">
 import { ref, onMounted } from 'vue'
  import useEmitter from '@/hooks/useEmitter.js'
 
  // const isOpen  = ref(true)
  const emitter = useEmitter()
  onMounted(() => {
    emitter.on('change', (isOpen : boolean) => {
      watch: {
        isOpen:{
          //let aContainer = document.querySelector("#a-container") as any;
          //aContainer.classList.toggle("is-txl");
        
        //b中样式
        let bContainer = document.querySelector("#b-container") as any;
        bContainer.classList.toggle("is-txl");
         bContainer.classList.toggle("is-z200");
        }
      }
    })
  })
 
</script>

<style scoped>
@import '../../../styles/login.scss'
/* @import './login.css'; */
/* 将源码中的css样式单独存放,在各组件中导入就可以。*/
</style>